<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>投票列表</title>
<link type="text/css" rel="stylesheet" href="css/style.css" />
</head>
<body>

<div id="app">
	<common ref="com" @query="queryByWord">
		<div id="vote" class="wrap">
			<h2>投票列表</h2>
			<ul class="list">
				<li v-for=" v in votes" class="odd" >
					<h4>
						<a :href="'view.html?'+v.id">{{v.vname}}</a>
					</h4>
					<div class="join"><a :href="'vote.html?'+v.id">我要参与</a></div>
					<p class="info">共有 {{v.icnt}} 个选项，已有 {{v.ucnt}} 个网友参与了投票。</p>
				</li>
			</ul>
		</div>
	</common>
</div>
<script src="js/vue.min.js"></script>
<script src="js/axios.min.js"></script>
<script src="js/vote.js"></script>
<script>
	var v = new Vue({
		el : "#app",
		data:{votes:[]},
		methods:{
			query(){
				axios.get("/demovote/vote/query").then(res=>{
					this.votes = res.data;
				})
			},
			queryByWord(word){
				if(word){
					axios.get("/demovote/vote/query?vname="+word).then(res=>{
						this.votes = res.data;
					})
				} else {
					this.query();
				}
			}
		},
		created(){
			this.query();
		}
	})
</script>

</body>
</html>
